<template>
	<view class="content">
		<view class="info_div">

			<view class="item_div">
				<view style="display: flex;">
					<view style="color: red;">*</view>认证公司 |
				</view>
				<view class="et" @click.stop="onSelCom">{{info.company_name || '请选择物流公司'}} ></view>
			</view>

			<view class="item_div">
				<view style="display: flex;">
					<view style="color: red;">*</view>
					<view style="visibility: hidden;">空</view>负责人 |
				</view>
				<view class="et" @click.stop="onSelUser">{{info.name || '请选择负责人'}} ></view>
			</view>

			<view class="item_div" style="display: none;">
				<view>认证地址 |</view>
				<view class="et" @click.stop="onChooseLocation">{{map_position}} ></view>
			</view>

			<view class="item_div_2" style="display: none;">
				<view style="display: flex;">
					<view style="color: red;visibility: hidden;">*</view>认证备注 |
				</view>
				<textarea class="et_2" placeholder="请输入备注" @input="onInputRemark" :value="info.remark" />
			</view>

			<view class="item_div">
				<view style="display: flex;">
					<view style="color: red;">*</view>认证期限 |
				</view>
				<radio-group style="margin: 16rpx 0 20rpx 0;display: flex;align-items: center;" @change="onRadioChange">
					<label style="display: flex;align-items: center;">
						<radio style="transform:scale(0.8);" :checked="info.type == 1" value="1"></radio>
						一年
					</label>
					<label style="display: flex;align-items: center;margin: 0 0 0 100rpx;">
						<radio style="transform:scale(0.8)" :checked="info.type == 2" value="2"></radio>
						永久
					</label>
				</radio-group>
			</view>

		</view>

		<view class="op_btn_div">
			<view id="btn_ok" @click.stop="onOk">{{info.id ? '确认编辑' : '提交信息'}}</view>
		</view>

	</view>
</template>

<script>
	import { getUInfo, timeStr2Timestamp, getCityAndProvince } from '@/util/util.js'
	import { checkUpdate } from '@/util/uni_util.js'
	const uploadImage = require('@/util/oss/upload.js')
	export default {
		data() {
			return {
				hint: '请扫描用户点击优惠券展示的二维码',

				map_position: '请选择地理位置', // 地图选点位置
				location: {}, // 地理位置对象
				province_str: '山东省', // 安装地区:省份字符串
				city_str: '临沂市', // 安装地区:城市字符串

				// 信息对象
				info: {
					// install_time: '', // 预约时间
					name: '', // 用户名
					user_id: '', // 用户id
					company_name: '', // 公司名称
					company_id: '', // 公司id
					type: 1, // 认证时长 1 年 2 永久
					remark: '', // 客户要求
					// 默认临沂 118.233695, 35.10305
					lon: '118.233695', // 经度
					lat: '35.10305', // 纬度
				},
			}
		},

		onLoad() {

			// 选择物流公司 
			uni.$on('onSelCom', (data) => {
				let com = data.msg
				if (com) {
					this.info.company_id = com.id // 需要传给接口的公司id
					this.info.company_name = com.company_name
				}
			})

			// 选择用户
			uni.$on('onSelUser', (data) => {
				let user = data.msg
				if (user) {
					this.info.user_id = user.id // 需要传给接口的用户id
					this.info.name = user.username
				}
			})

			// onEdit
			uni.$on('onEdit', (data) => {
				console.log('监听到事件onEdit，携带参数为：' + data.install_info);
				let install_info = data.install_info
				if (install_info) {

					this.info.id = install_info.id

					// install_time: '', // 预约时间
					this.info.remark = install_info.remark // 客户要求
					this.info.lon = install_info.lon
					this.info.lat = install_info.lat

					this.province_str = install_info.province
					this.city_str = install_info.city
				}
			})
		},

		mounted() {
			console.log('current.ver=20250429.0958b');
			let that = this
			if (!getUInfo() || !getUInfo().token) {
				uni.redirectTo({ url: '/pages/login/login' })
			}

			try {
				// this.reqQueyMySqlUser()
			} catch (error) {

			}

		},

		onShow() {
			checkUpdate()
		},

		methods: {

			// 单选框改变事件
			onRadioChange(e) {
				// console.log('event = ', event);
				// console.log('index = ', index);
				this.info.type = e.detail.value
			},

			// 打开地图选点
			onChooseLocation() {
				// uni.navigateTo({ url: '/pages/ext/sel_map_loc/sel_map_loc' })
				uni.chooseLocation({
					success: (res) => {
						console.log('地图选择位置的结果 = ', JSON.stringify(res));
						// console.log('位置名称：' + res.name);
						// console.log('详细地址：' + res.address);
						// console.log('纬度：' + res.latitude);
						// console.log('经度：' + res.longitude);
						this.map_position = res.name
						this.location = res
						this.info.lon = res.longitude
						this.info.lat = res.latitude

						let analysisArea = getCityAndProvince(res.address)
						if (analysisArea) {
							if (analysisArea.length >= 2) {
								this.province_str = analysisArea[0]
								this.city_str = analysisArea[1]
							} else if (analysisArea.length >= 1) {
								this.province_str = analysisArea[0]
								this.city_str = ''
							} else if (analysisArea.length == 0) {
								this.province_str = '山东省'
								this.city_str = '临沂市'
							}
						} else {
							this.province_str = '山东省'
							this.city_str = '临沂市'
						}

					},
					fail: () => {
						uni.showToast({ title: '未获取到位置信息', icon: 'none' })
					}
				})

			},

			// onUploadImg
			onUploadImg(index) {
				this.chooseWxImage(index)
			},

			// 微信选择图片或拍照
			chooseWxImage(index) {
				let that = this
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					// sourceType: [type],
					success(res) {
						console.log('选择的图片路径 = ', res);
						uni.showLoading({ title: '图片上传中...', mask: true })
						uploadImage(res.tempFilePaths[0], 'hhsaz/',
							(res) => {
								uni.hideLoading()
								uni.showToast({ title: '上传成功', icon: 'none' })
								console.log('index = ', index);
								console.log("上传成功结果 = ", res)
							},
							(res) => {
								uni.hideLoading()
								uni.showToast({ title: '上传失败', icon: 'none' })
							}
						)

					},

					fail(res) {
						uni.showToast({ title: '未获取到图片信息', icon: 'none' })
					}

				})
			},

			// 选择物流公司
			onSelCom() {
				uni.navigateTo({ url: '/pages/ext/com_list/com_list' })
			},

			// 选择负责人
			onSelUser() {
				uni.navigateTo({ url: '/pages/ext/user_list/user_list' })
			},

			// 输入备注
			onInputRemark(e) {
				this.info.remark = e.detail.value
			},

			// 点击确认提交
			onOk() {
				if (!this.info.company_id) {
					uni.showToast({ icon: 'none', title: '请选择物流公司' })
					return
				}
				if (!this.info.user_id) {
					uni.showToast({ icon: 'none', title: '请选择负责人' })
					return
				}

				let token = getUInfo().token
				let fixedObj = { token, user_id: this.info.user_id, company_id: this.info.company_id, type: this.info.type }

				console.log('准备提交的信息2 = ', JSON.stringify(fixedObj))

				uni.showModal({
					title: '提示',
					content: '是否提交认证信息？',
					confirmColor: '#fdd30d',
					success: res => {
						if (res.confirm) {
							this.reqAuditCom(fixedObj)
						}
					}
				})

			},

			// 接口:认证物流公司
			async reqAuditCom(fixedObj) {
				let that = this
				uni.showLoading({ title: '处理中', mask: true, })
				let res = await that.$auditCom(fixedObj)
				console.log(`$auditCom...res=`, JSON.stringify(res))
				if (res.code == 1) {
					uni.showModal({
						title: '提示',
						content: '认证成功！',
						confirmColor: '#fdd30d',
						success: res => {
							if (res.confirm) {

							}
						}
					})
				} else {
					uni.showToast({ icon: 'none', title: res.msg })
				}

			},

			// 重置信息
			resetInfo() {
				this.info = {
					id: '', // 安装需求id
					remark: '', // 客户要求
					// 默认临沂 118.233695, 35.10305
					lon: '118.233695', // 经度
					lat: '35.10305', // 纬度
				}
				delete this.info.id

				this.province_str = '山东省' // 省份
				this.city_str = '临沂市' // 城市

				this.map_position = '请选择地理位置' // 地图选点位置

				// 地理位置对象
				this.location = {}
			},

			// 接口:查询mysql用户
			async reqQueyMySqlUser() {
				let that = this
				let res = await that.$queryMySqlUser()
				console.log(`reqQueyMySqlUser...res=`, res)
			},

		}
	}
</script>

<style scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	/* 分割线 */
	.divider {
		width: 100%;
		height: 1rpx;
		background-color: rgba(0, 0, 0, 0.2);
	}

	.info_div {
		display: flex;
		flex-direction: column;
		width: calc(100% - 40rpx);
		margin: 20rpx 20rpx 0 20rpx;
	}

	/* 每个填写项目的容器 */
	.item_div {
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		margin: 22rpx 0 0 0;
		font-size: 28rpx;
		/* background-color: red; */
		overflow: hidden;
	}

	/* 大一点的项目容器 */
	.item_div_2 {
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: 100rpx;
		/* line-height: 100rpx; */
		margin: 30rpx 0 0 0;
		font-size: 30rpx;
	}

	/* 预约时间项目的容器 */
	.item_div_3 {
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: 86rpx;
		line-height: 60rpx;
		margin: 22rpx 0 0 0;
		font-size: 30rpx;
		/* background-color: red; */
		overflow: hidden;
	}

	.et {
		/* background-color: red; */
		flex-grow: 1;
		margin: 0 0 0 0rpx;
		max-width: 70%;
		height: 60rpx;
		text-align: right;
		font-size: 28rpx;
	}

	.et_2 {
		/* background-color: red; */
		flex-grow: 1;
		margin: 0 0 0 0rpx;
		max-width: 70%;
		height: 100rpx;
		/* line-height: 100rpx; */
		text-align: right;
		font-size: 30rpx;
		/* border: solid 1rpx gray; */
		/* vertical-align: middle; */
	}

	.et_3 {
		display: flex;
		/* background-color: red; */
		flex-grow: 1;
		margin: 0 0 0 0rpx;
		max-width: 70%;
		height: 60rpx;
		font-size: 28rpx;
		/* background-color: red; */
	}

	.area {
		width: 30%;
		flex-grow: 1;
		text-align: center;
		/* background-color: blue; */
		border: solid 1rpx #cccccc;
	}

	/* 赠品项目的容器 */
	.item_div_4 {
		display: flex;
		justify-content: space-between;
		width: 100%;
		height: 118rpx;
		margin: 22rpx 0 0 0;
		font-size: 30rpx;
		overflow: hidden;
	}

	.et_4 {
		/* background-color: red; */
		flex-grow: 1;
		margin: 0 0 0 0rpx;
		max-width: 82%;
		height: 60rpx;
		text-align: right;
		font-size: 30rpx;
	}

	/* 锁体照片 */
	#img_lock {
		width: 60rpx;
		height: 60rpx;
		border-radius: 8rpx;
		margin: 0 20rpx 0 0;
	}

	/* 操作按钮容器 */
	.op_btn_div {
		display: flex;
		justify-content: center;
		align-items: center;
		width: calc(100% - 80rpx);
		margin: 40rpx 0rpx 0 0rpx;
	}

	#btn_ok {
		align-self: center;
		width: 90%;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		font-weight: bold;
		background: #F7D34B;
		border-radius: 16rpx;
		margin: 80rpx 0 24rpx 0;
	}
</style>